// store/theme.js
import { defineStore } from 'pinia'
import themeConfig from "@/libs/config/theme.js"

// 主题配置
export const useThemeStore = defineStore('theme', {
    state: () => ({
        mode: Object.keys(themeConfig)[0],
        themeOptions: Object.keys(themeConfig)
    }),
    getters: {
        /**
         * 主题配置从此处取出
         */
        styles(state){
            return themeConfig[state.mode]
        }
    },
    actions: {
        initExportStyles(){
            uni.$u.props.navbar.bgColor = this.styles['bg-navbar-base'];
            uni.$u.props.navbar.titleColor = this.styles['text-navbar-title'];
        },
        // 设置主题
        setTheme(mode) {
          if (!this.themeOptions.includes(mode)) {
              console.warn(`请设置${ this.themeOptions.join('、') }当中的主题模式`)
              return
          };
          this.mode = mode;
          this.initExportStyles();
        },
         // 获取当前主题的颜色值
        getColor(key) {
          return this.styles[key] || 'transparent';
        },
        
        // ========== 快捷样式生成方法 ==========
        // 生成背景色样式对象
        bg(key) {
          return {
            'background-color': this.getColor(key)
          };
        },
        
        // 生成文字颜色样式对象
        color(key) {
          return {
            'color': this.getColor(key)
          };
        },
        
        // 生成边框颜色样式对象
        border(key) {
          return {
            'border-color': this.getColor(key)
          };
        },
        
        // 生成复合样式（如背景+文字）
        combo(keys = { bg: null, color: null }) {
          const style = {};
          if (keys.bg) style['background-color'] = this.getColor(keys.bg);
          if (keys.color) style['color'] = this.getColor(keys.color);
          return style;
        }
    },
    persistedstate: {
        // 定义需要持久化的字段
        paths: ['mode'] 
    }
})